#app {}

div {
  padding: 30px;
  font-size: 18px;
  color: #eee;
  margin-bottom: 6px;
}

.card-box:nth-child(1) {
  background-color: #eaeac3;
  color: #333;
}


.card-box:nth-child(2) {
  background: linear-gradient(to right, #eaeac3, #008cff);
  color: #333;
}

.card-box:nth-child(3) {
  background: #eaeac3;
  color: #333;
  transition: background 2s;
}

.card-box:nth-child(3):hover {
  background: red;
}


.card-box:nth-child(4) {
  background: linear-gradient(to right, #eaeac3);
  color: #333;
  transition: background 2s;
}

.card-box:nth-child(4):hover {
  background: linear-gradient(to right, #008cff);
}